<template>
  <Maptalks :mapOnLoadCB="mapOnLoadCB"></Maptalks>
</template>

<script>
import Maptalks from "@/components/common/Maptalks.component.vue"
import MapLayerConst from "@/const/MapLayerConst"
import heatAddressPoints from "@/data/heatmap.points.1w"

export default {
  name: "AddHeatLayer.component",
  components: {Maptalks},
  setup() {

    let mapOnLoadCB = (map) => {

      let data = heatAddressPoints.map(function (p) {
        return [p[1], p[0]];
      });
      map.setCenter([117.3745188667, 23.8839])
      new maptalks.HeatLayer(MapLayerConst.MAP_HEAT_LAYER, data, {
        // "max": 10,
        // "radius": 80,
        // "blur": 30,
        // "gradient": {0.4: "blue", 0.65: "lime", 1: "red"},
        "heatValueScale": 0.7,
        "forceRenderOnRotating": true,
        "forceRenderOnMoving": true
      }).addTo(map)

    };

    return {
      mapOnLoadCB
    }
  }
}
</script>

<style scoped>

</style>